<template>
  <div class="mod-config">
    <basic-container>
      <div class="boxsty zhiBiao">
          <div class="flex">
                <el-form :model="searchForm"  :inline="true" class="form-inline">
                <el-form-item label="职位编码">
                    <el-input v-model="searchForm.stationId" placeholder="职位编码" style="width: 150px;"  :clearable="true"></el-input>
                </el-form-item>
                <el-form-item label="职位全称">
                    <el-input v-model="searchForm.stationFullName" placeholder="职位全称" style="width: 150px;" :clearable="true"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button icon="el-icon-search" type="primary" class="marginLeft" @click="search()">检索</el-button>
                </el-form-item>
                </el-form>
            </div>
            <div style="height: 50px; border-bottom: 1px solid #b0bde2">
                <el-form :model="form"  :inline="true" class="form-inline">
                    <el-form-item label="组织机构编码">
                        <el-input v-model="form.code" style="width: 150px;"  :clearable="true"></el-input>
                    </el-form-item>
                    <el-form-item label="开始日期">
                        <el-date-picker v-model="form.date" type="date" style="width: 150px;" :clearable="true"></el-date-picker>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="getStationData()">获取平台职位信息</el-button>
                    </el-form-item>
                </el-form>
                <!-- <el-button type="primary">同步本地</el-button> -->
            </div>
            <el-table :data="dataList"
                style="width: 100%;margin-top:20px"
                 border
                @load="dataListLoading"
                ref="tableRef">
                <el-table-column type="index" width="60" header-align="center" align="center" label="序号"></el-table-column>
                <el-table-column
                  prop="stationId"
                  header-align="center"
                  align="center"
                  min-width="120"
                  show-overflow-tooltip
                  label="职位编码">
                </el-table-column>
                <el-table-column prop="stationShortName" label="职位简称" min-width="100" header-align="center" align="center"></el-table-column>
                <el-table-column prop="stationFullName" label="职位全称" min-width="100" header-align="center" align="center"></el-table-column>
                <el-table-column prop="beginDate" label="开始日期" min-width="100" header-align="center" align="center"></el-table-column>
                <el-table-column prop="endDate" label="结束日期" min-width="100" header-align="center" align="center"></el-table-column>
                <el-table-column prop="orgId" label="所属单位编码" min-width="100" header-align="center" align="center">
                </el-table-column>
                <el-table-column prop="stationType" label="职位类别" min-width="100" header-align="center" align="center">
                </el-table-column>
                <el-table-column prop="stationTypeLText" label="职位类别全称" min-width="120" header-align="center" align="center">
                </el-table-column>
                <el-table-column prop="positionLevel" label="岗位层级" min-width="100" header-align="center" align="center">
                </el-table-column>
                <el-table-column prop="positionLevelLText" label="岗位层级全称" min-width="120" header-align="center" align="center">
                </el-table-column>
                <el-table-column prop="positionDutyType" label="岗位职责编码" min-width="100" header-align="center" align="center">
                </el-table-column>
                <el-table-column prop="positionDutyTypeLText" label="岗位职责文本" min-width="120" header-align="center" align="center">
                </el-table-column>
                <el-table-column prop="stationSort" label="职位排序" min-width="120" header-align="center" align="center">
                </el-table-column>
            </el-table>
            <div class="avue-crud__pagination">
            <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex"
                            :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage" background
                            layout="total, sizes, prev, pager, next, jumper">
            </el-pagination>
            </div>
      </div>
      </basic-container>
  </div>
</template>

<script>
import {pageStation, getToken, getStationInfo} from '@/api/hrssc/hrssc'

export default {
    components:{
    },
    data(){
        return{
            dataListLoading: false,
            form: {},
            searchForm: {},
            dataList: [],
            pageIndex: 1,
            pageSize: 10,
            totalPage: 0,
          loading:null,
        }
    },
    created () {
        this.token()
    },
    methods:{
        //获取token
        token(){
            getToken().then(res => {
               //console.log(res)
            })
        },
        //获取平台用户信息
        getStationData(){
            //获取平台数据
            var param = {
                "mode": "Q",
                "beginDate": this.form.date,
                "orgId": this.form.code
            }
            this.loadingPage();
            if(this.form.code != null && this.form.code != ""){
                //数据作为参数调用本地保存到hrssc接口
                getStationInfo(param).then(res => {
                  this.loading.close();
                    //获取hrssc数据列表
                    this.getDataList()
                })
            }else{
                this.$message.error("请填写日期与组织机构编码")
            }
            this.getDataList()
        },
        //获取组织机构hrssc列表
        getDataList () {
            this.dataListLoading = true
            pageStation(Object.assign({
                current: this.pageIndex,
                size: this.pageSize
                },this.searchForm)).then(response => {
                this.dataList = response.data.data.records
                this.totalPage = response.data.data.total
            })
            this.dataListLoading = false
        },
        // 每页数
        sizeChangeHandle(val) {
            this.pageSize = val
            this.pageIndex = 1
            this.getDataList()
        },
        // 当前页
        currentChangeHandle(val) {
            this.pageIndex = val
            this.getDataList()
        },
        //搜索
        search(){
            this.getDataList()
        },
      //全局加载框
      loadingPage(){
        this.loading = this.$loading({
          lock: true,
          text: '正在加载，请销后...',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
      },
    }
}
</script>

<style>

</style>
